<template>
    <div class="">
        <el-dialog width="1000px" :title="lessonTitle" :visible.sync="state" :show-close="true" :lock-scroll="true" :close-on-click-modal="false">
            <div class="lesson_con">
                <el-checkbox-group v-model="checkedClass">
                    <el-checkbox v-for="(item,index) in classList" :ref="'checkbox'+item.id" :label="item.id" :key="item.id" :disabled="item.isDisabled">{{item.shortName}}</el-checkbox>
                </el-checkbox-group>
            </div>
            <div class="components_searchs">
                <span class="tit">选择周次：</span>
                <el-input  placeholder="请选择周次" v-model="weekShowLine" disabled></el-input>
                <el-button type="primary" @click="showWeekSelector()"  size="mini">选择教学周</el-button>
            </div>

            <el-form :model="lessonInfo" :rules="rules" inline ref="lessonInfo"label-width="90px">
                <el-form-item label="星期：" prop="week">
                    <el-select v-model="lessonInfo.week" size="mini" placeholder="请选择">
                        <el-option
                          v-for="item in options.week"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="节次：" prop="section">
                    <el-select v-model="lessonInfo.section" size="mini" multiple placeholder="请选择">
                        <el-option
                          v-for="item in options.section"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="授课地点：" prop="teachPlace">
                    <el-input size="mini" v-model="lessonInfo.teachPlace"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" size="small"
                v-loading.fullscreen.lock="fullscreenLoading"
                @click="addLesson">确 定</el-button>
                <el-button size="small" @click="state = false">关 闭</el-button>
            </div>

        </el-dialog>
        <!-- 周次选择 -->
        <week-selector
            :datas="weekPassList"
            ref="weekSelector"/>
    </div>
</template>

<script>
    import {enums} from '@/constant'
    import {config} from '@/config'
    import week_selector from "../../../common/week-selector"
    export default {
        components: {
            "week-selector":week_selector
        },
        data() {
            return {
                self: this,
                lessonTitle:'',
                state: false,
                fullscreenLoading: false,
                weekShowLine:null,
                lessonInfo:{
                    baseId: 0,
                    classId: "",
                    section: "",
                    teachPlace: "",
                    teachWeek: "",
                    teacherId: null,
                    week: null
                },
                rules:{
                    week: [
                        { required: true, message: '请选择星期', trigger: 'change' }
                    ],
                    section: [
                        { required: true, message: '请选择节次', trigger: 'change' }
                    ],
                    teachPlace: [
                        { required: true, message: '请填写授课地点', trigger: 'blur' }
                    ],
                },
                classList:[],         // 班级列表
                checkedClass: [],     // 已选择的班级
                numberList:["一","二","三","四","五","六","七","八","九","十","十一","十二"],
                classSyllabusItem:{},
                weekPassList:[],
                weekList:[],//请求的数据
                weekSelecttList:[],//整理后的数据格式
                syllabusList:[],
                baseId:null,
                options: {
                    week:[{
                          value: '1',
                          label: '周一'
                        }, {
                          value: '2',
                          label: '周二'
                        }, {
                          value: '3',
                          label: '周三'
                        }, {
                          value: '4',
                          label: '周四'
                        }, {
                          value: '5',
                          label: '周五'
                        }, {
                          value: '6',
                          label: '周六'
                        }, {
                          value: '7',
                          label: '周日'
                        }],
                    section:[{
                            value: '1',
                            label: '第一节'
                        },{
                            value: '2',
                            label: '第二节'
                        },{
                            value: '3',
                            label: '第三节'
                        },{
                            value: '4',
                            label: '第四节'
                        },{
                            value: '5',
                            label: '第五节'
                        },{
                            value: '6',
                            label: '第六节'
                        },{
                            value: '7',
                            label: '第七节'
                        },{
                            value: '8',
                            label: '第八节'
                        },{
                            value: '9',
                            label: '第九节'
                        },{
                            value: '10',
                            label: '第十节'
                        }]
                }
            };
        },
        created() {
            // this.getSyllabus();
        },
        mounted() { },
        watch: {},
        methods: {
            // 打开模态框
            showDialog(val){
                this.professionId = val.professionId;
                this.grade = val.grade;

                this.lessonInfo.teacherId = val.userId;
                this.lessonInfo.baseId = val.id;

                this.lessonTitle = val.professionName +" - "+ val.courseName;

                this.lessonInfo.classId = '';
                this.lessonInfo.section = [];
                this.lessonInfo.teachPlace = '';
                this.lessonInfo.teachWeek = '';
                this.weekShowLine = '';
                this.checkedClass = [];
                this.getSyllabus();
                this.getWeekList();
                this.$nextTick(function(){
                    this.$refs['lessonInfo'].resetFields();
                })
                this.state = true;
                this.weekShowLine = null;
            },
            //请求教学周 初始数据
            getWeekList(){
                let self = this;
                self.axios.get(api.syllabusManager.queryTeachWeek+self.lessonInfo.baseId).then((response) => {
                    if(response.data.success){
                        if(response.data.data.length > 0){
                            self.weekList = JSON.parse(JSON.stringify(response.data.data));
                            self.state = true;
                        }else{
                            // 操作失败
                            this.$message({
                                message: "该专业还未配置教学周，请重新选择！",
                                type:'error',
                                center: true
                            });
                        }
                    }else{
                        // 操作失败
                        self.$message({
                            message: response.data.msg,
                            type:'error',
                            center: true
                        });
                    }

                });
            },
            //获取课程表数据
            getSyllabus(){
                var self = this;
                self.axios({
                    method: "get",
                    url: api.schoolClass.queryAllByCondition,
                    params: {
                        "professionId": self.professionId,
                        "grade": self.grade,
                    }
                }).then((response)=>{
                    if(response.data.success){
                        if(response.data.data){
                            self.classList = JSON.parse(JSON.stringify(response.data.data));
                            for (var i = 0; i < self.classList.length; i++) {
                                self.$set(self.classList[i], 'isDisabled', false);
                            };
                        }else{
                            self.$message.error("还没有班级选择该专业！");
                        }

                    }else{
                        self.$message.error(response.data.msg);
                    }
                })
            },
            //整理数据，打开 选择周弹窗
            showWeekSelector(){

                let weekList = this.weekList;
                let weekSelecttList = this.weekSelecttList;

                let lineCount =weekList.length/7;
                if(weekList.length % 7 >0){
                    lineCount += 1;
                }
                let weekPassList=[];

                for(let i=0;i<lineCount;i++){
                    let weekItem=[];
                    for(let j=1;j<=7;j++){
                        if(7*i+j<=weekList.length){
                            let bool_temp = false;
                            //判断传过去的值回显问题
                            for(let num=0;num<weekSelecttList.length;num++){
                                if(weekSelecttList[num].teachWeek == weekList[7*i+j-1].week){
                                    bool_temp = true;
                                }
                            }

                            weekItem.push({
                                id:weekList[7*i+j-1].id,
                                teachWeek:weekList[7*i+j-1].week,
                                beginTime:weekList[7*i+j-1].startDate,
                                endTime:weekList[7*i+j-1].endDate,
                                select:bool_temp
                            });
                        }
                    }
                    weekPassList.push(weekItem);
                }
                this.weekPassList = weekPassList;
                this.$refs.weekSelector.showDialog();
            },
            parseStringToInt(arr){
                let arrInt = [];
                for(let i=0;i<arr.length;i++){
                    arrInt.push(parseInt(arr[i]));
                }
                return arrInt;
            },
            //子控件回调父类
            putSelectWeekList(params){
                let weekShowLine =[];
                let weekCurrentList = params.data;
                for(let i=0;i<weekCurrentList.length;i++){
                    weekShowLine.push(weekCurrentList[i].teachWeek);
                }
                this.weekShowLine = weekShowLine.join(",");
            },
            // 提交数据
            addLesson(){
                let self = this;
                self.$refs.lessonInfo.validate((valid) => {
                    if (valid) {
                        if(self.checkedClass.length>0){ //选择班级
                            if(self.weekShowLine){      //教学周

                                let submitData = self.lessonInfo;
                                self.lessonInfo.teachWeek = self.weekShowLine;
                                self.lessonInfo.classId = self.checkedClass.join(',');
                                self.lessonInfo.section = self.lessonInfo.section.join(',');

                                console.log(self.lessonInfo);
                                // 发送请求
                                self.fullscreenLoading = true;
                                self.axios.post(api.syllabusManager.addLessonInfo, submitData)
                                .then((response) => {
                                    if (response.data.success) {
                                        self.$message({
                                            type: 'success',
                                            message: response.data.msg,
                                        });
                                        self.$emit('refreshList');
                                        self.state = false;
                                    } else {
                                        self.$message.error(response.data.msg);
                                    }
                                    self.fullscreenLoading = false;
                                })

                            }else{
                                self.$message.error("请配置教学周");
                            }
                        }else{
                            self.$message.error("请选择班级");
                        }
                    }else{
                        return false;
                    }
                })
            }
        },
    };
</script>
<style scoped>

</style>